<!doctype html>
<html lang="en">
<head>
    <title>品牌价值创意库</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0" />
    <meta name="keywords" content="CreativeGallery" />
    <meta name="description" content="CreativeGallery" />
    <link rel="shortcut icon" href="__IMG__/favicon.ico" />
	<link rel="stylesheet" type="text/css" href="__CSS__/index.css"/>

</head>
		<style type="text/css">
			.login{
				position: relative;
				width: 100%;
				background: url(__IMG__/login_bg.jpg) no-repeat;
				background-size: 100% 100%;
			}
			.login .login_insightlogo{
				margin-left: 20px;
				margin-top: 20px;
			}
			.login .login_content{
				text-align: center;
				padding-top: 40px;
				position: absolute;
				top: 50%;
				left: 50%;
				margin-left: -185px;
				margin-top: -200px;
				width: 370px;
				height: 360px;
				background-color: white;
				opacity: 0.9;
				filter:alpha(opacity=90);
			}
			.login .title{
				margin-bottom: 40px;
				padding-bottom: 5px;
				display: inline-block;
				border-bottom: 2px #c30d23 solid;
				font-size: 20px;
				line-height: 20px;
				color: #595757;
			}
			.login_content form{
				width: 250px;
				margin: 0 auto;
			}
			.login .login_content_input{
				border: 1px #b2a8a2 solid;
				padding: 4px;
				height: 32px;
				box-sizing: border-box;
				margin-bottom: 20px;
			}
			.login .login_content_input input{
				margin-left: 10px;
				border: none;
				padding: 0 5px 0 5px;
				height: 22px;
			}
			.login .login_content_input .img{
				height: 22px;
				display: block;
				width: 30px;
				text-align: left;
				border-right: 1px solid #b2a8a2;
			}
			.login .login_content_input .user{
				width: 80px;
			}
			.login .login_content_input .password{
				width: 189px;
			}
			.login .login_content_input .email{
				width: 100px;
				font-size: 14px;
				line-height: 22px;
				display: inline-block;
				height: 22px;
			}
			.login .error{
				color: black;
				font-size: 12px;
				line-height: 22px;
				margin-bottom: 20px;
			}
			.login .submit{
				font-family: "microsoft yahei";
				width: 250px;
				display: block;
				height: 30px;
				background-color: #c30d23;
				color: white;
				font-size: 18px;
				line-height: 18px;
				border: none;
				cursor: pointer;
			}
			.forget{
				margin-top: 5px;
				color: #595757;
				font-size: 12px;
			}
			.layui-layer-forget .layui-layer-content{
				text-align: center;
				font-size: 14px;
				line-height: 30px;
				background-color: #fef5ec;
			}
			.mtop{
				margin-top: 120px;
			}
			
			@media only screen and (max-width: 768px) {
				.login_insightlogo{
					width: 30%;
				}
			}
		</style>
<body>
	<div class="login graybg">
	<img class="login_insightlogo" src="__IMG__/login_insightlogo.png"/>
	<div class="login_content">
		<h1 class="title">创意库</h1>
		<form action="" method="post">
			<div class="login_content_input">
				<span class="img fl">
					<img src="__IMG__/login_user.png"/>
				</span>
				<input class="fl user" placeholder="因赛邮箱"  type="text" name="" id="account" value="" onBlur="this.value=ignoreSpaces(this.value);"/>
				<span class="fl email">@gdinsight.com</span>
				<div class="clear"></div>
			</div>
			<div class="login_content_input">
				<span class="fl img">
					<img src="__IMG__/login_password.png"/>
				</span>
				<input class="fl password" placeholder="密码" type="password" name="" id="password" value="" />
				<div class="clear"></div>
			</div>
			<div class="error"></div>
			<input class="submit" id='btn_submit'  type="button" value="登录"/>
			<a class="forget fr" href="javascript:;">忘记密码？</a>
		</form>
		
	</div>
</div>

	<script src="__JS__/jquery-2.1.0.js" type="text/javascript" charset="utf-8"></script>
	<script src="__JS__/layer/layer.js" type="text/javascript" charset="utf-8"></script>
	<script type="text/javascript">
		/*忘记密码*/
		$(".forget").click(function(){
			layer.open({
				area: ['370px', '400px'],
				title:0,
			  	type: 1,
			  	skin: 'layui-layer-forget', //样式类名
			  	closeBtn: 0, //不显示关闭按钮
			  	anim: 2,
			  	shadeClose: true, //开启遮罩关闭
			  	content: '<p class="mtop">忘记密码了？</p>'+
			  	'<p>请联系研发及传播中心</p>'+
			  	'<p>吃硬盘小组组长:关晓琳</p>'+
			  	'<p>QQ:149891799</p>'
			});
		})
		
		$(document).ready(function() {
			mainliWidth();
			$(window).resize(function() {
				mainliWidth();
			});
		
			function mainliWidth() {
				var winhei = $(window).height();
				$(".login").height(winhei);
			}
		});
		
		/*登录动作*/
		$('#btn_submit').click(function(){
			var _account = $('#account').val();
			var _password = $('#password').val();
			var _jump = "{$jumpurl}";
			$.ajax({
				url:"{:U('login')}",
				type:'post',
				data:{u_account:_account+'@gdinsight.com',u_password:_password,jump:_jump},
				beforeSend:function(){
					if (_account == '' || _password == '') {
						$('.error').html('请填写正确的账户密码！！');
						return false;
					}
				},
				success:function(ret){
					
					if (ret.status) {
						window.location.href= _jump ? _jump :"__APP__";
					}else{
						var info = ret.info;
						if(info == "密码错误！找回密码请联系HR世宇或品传中心刘洋"){
							info = "密码错误！<br />找回密码请联系HR世宇或品传中心刘洋"
						}
						$('.error').html(info);
						return false;
					}
				}
			})
		})
		
		//键盘回车登录
		$(document).ready(function(){ 
			$("body").keydown(function(e){ 
				var curKey = e.which; 
				if(curKey == 13){ 
				 	$('#btn_submit').click();
				} 
			}); 
		}); 
		
		//去除空格键
		function ignoreSpaces(string) {
			var temp = "";
			string = '' + string;
			splitstring = string.split(" ");
			for(i = 0; i < splitstring.length; i++)
			temp += splitstring[i];
			return temp;
		}
	</script>
</body>
</html>
